// 视频页的评论功能
var userIdmessage =  document.getElementById("userIdmessage")
var useId=userIdmessage.innerHTML

// 封装获取元素的方法
function getType(selector){
    return selector.substring(0,1)=='.'?document.getElementsByClassName(selector.substring(1)):document.getElementById(selector.substring(1));
}
var test = window.location.href;
var numberId=test.split('?')[1] 
console.log(numberId);

// 1.遍历出来主评论
var mainId=[]  
var SonId1=[];
var sonId=[] 
var sonOneId2=[] 
var sonTwoId2=[]   
function showComment(){
    axios({
        url: '/video/findCommentByVideoId',
        method: 'get',
        params:{
            videoId:numberId
        }
    })
    .then(function(data){
        if(data.data.data.length==0){
            getType('.no-comment')[0].style.display='block';
            getType('.block_title')[0].style.display='none';
            getType('.section')[0].style.display='none';
        }else{
              getType('.block-span')[0].innerHTML="("+data.data.data.length+")"
                let str=''
                // 显示主评论
                for(let i=0;i<data.data.data.length;i++){                    
                    str+=`
                    <div class='section-bd'>
                        <img src="${data.data.data[i].src}" alt="">
                    </div>
                    <div class='section-hd' data-fatherId=${data.data.data[i].commentId}>
                        <div class='comment-name'>
                            <span class='name-span'>${data.data.data[i].nickname}</span>
                        </div>
                        <div class='subject'>
                            <span class='subject-span'>${data.data.data[i].content}</span>
                        </div>
                        <div class='talk'>
                            <span class='date-span'>${data.data.data[i].releaseTime}</span>
                            <a class='talk-like'><i class='iconfont icon-shoucang2'></i>${data.data.data[i].thumbsUpComment}</a>
                            <span class='talk-lun'><i class='iconfont icon-pinglun'></i>评论</span>
                            <span class='talk-report' onclick=informer(this)><i class='iconfont icon-icon_jubao-xian'>举报</i></span>
                            ${data.data.data[i].userId==useId?"<span class='talk-delete' onclick=remove(this)><i class='iconfont icon-shanchu'></i></span>":''}
                        </div>
                        <div class='children'>
                            <div class='pop-relay'>
                                <textarea name="content" autocomplete="off" style="height: 60pa;padding: 10px;" class='text2'></textarea>
                            </div>
                            <div class='commentSub'>
                                <button class='writeBack'>回复</button>
                            </div>
                        </div>
                        <div class='answer'>
                            
                        </div>
                    </div>
                    `
                    getType('.section')[0].innerHTML=str;
                    mainId.push(data.data.data[i].commentId)
                    SonId1.push(data.data.data[i].userId)
                }
               
                // 遍历是否点赞主评论
                if(userIdmessage.innerHTML==''){
                    for(let j=0;j<mainId.length;j++){
                        getType('.talk-like')[j].onclick=function(){ 
                            getType('#loginmodal').style.display='block';
                        }
                    }
                }else{   
                    for(let i=0;i<mainId.length;i++){
                        axios({
                            url: '/video/JudgeThumbsUpComment',
                            method: 'post',
                            params:{
                                userId:useId,
                                commentType:0,
                                commentId:mainId[i]
                            }
                        })
                        .then(function(data){              
                            if(data.data.data.object1==1){
                                // getType('.iconfont icon-shoucang2')[0].className='iconfont icon-jushoucanggift';
                                getType('.talk-like')[i].style.color='red'; 
                            }
                            // 进行点赞
                         
                            for(let j=0;j<mainId.length;j++){
                                getType('.talk-like')[j].onclick=function(){  
                                        axios({
                                            url: '/video/ThumbsUpComment',
                                            method: 'post',
                                            params:{
                                                userId:useId,
                                                commentType:0,
                                                commentId:mainId[j]
                                            }
                                        })
                                        .then(function(data){                      
                                            if(data.data.data.object1==1){
                                                getType('.talk-like')[j].style.color='red';
                                                getType('.talk-like')[j].innerHTML=`<i class='iconfont icon-shoucang2'></i>${data.data.data.object}`                                                          
                                            }
                                            else if(data.data.data.object1==0){
                                                getType('.talk-like')[j].style.color='grey';
                                                getType('.talk-like')[j].innerHTML=`<i class='iconfont icon-shoucang2'></i>${data.data.data.object}`                                                          
                                            }                                   
                                        })
                                        .catch(function(error){
                                            console.log('错误')
                                        })    
                                    // }                              
                                
                                } 
                            }
                        
                                                                
                        })
                        .catch(function(error){
                            console.log('错误')
                        })  
                    }
                }
                // 对主评论进行评论
                  var comment1=getType('.talk-lun').length
                  if(userIdmessage.innerHTML==''){
                      for(let i=0;i<comment1;i++){
                          getType('.talk-lun')[i].onclick=function(){
                              getType('#loginmodal').style.display='block';
                          }
                      }
                  }else{
                      for(let i=0;i<comment1;i++){
                          getType('.talk-lun')[i].onclick=function(){
                              getType('.children')[i].style.display='block'
                              getType('.writeBack')[i].onclick=function(){
                                  if(getType('.text2')[i].value==''){ 
                                      getType('.import-input')[0].style.display='block';
                                      getType('.import')[0].style.opacity='1'
                                      setTimeout(function(){
                                          getType('.import-input')[0].style.display='none';
                                          getType('.import')[0].style.opacity='0'
                                      },3000)
                                  }
                                  else{  
                                      axios({
                                          url: '/video/addCommentSon',
                                          method: 'post',
                                          params:{
                                              content:getType('.text2')[i].value,
                                              userOneId:useId,
                                              userTwoId:SonId1[i],
                                              commentId:mainId[i]
                                          }
                                      })
                                      .then(function(data){
                                            showComment();
                                        //   window.location.reload();    
                                      })
                                      
                                      .catch(function(error){
                                          console.log('错误')
                                      })
                                      
                                  }
                                  
                              } 
                          }
                      }
                  }

                //显示主评论下的子评论
                function showSonComment(){
                    for(let i=0;i<mainId.length;i++){
                        //遍历出来子评论
                        axios({
                            url: '/video/findCommentSonByCommentId',
                            method: 'get',
                            params:{
                                commentId:mainId[i]
                            }
                        })
                       .then(function (data) {
                           if(data.data.data.length==0){
                               getType('.answer')[i].innerHTML='';
                           }else{
                               let str2='';
                               for(let j=0;j<data.data.data.length;j++){
                                   str2+=`
                                       <div class='comment-c-item'>
                                           <div class='comment-hd'>
                                               <img src="${data.data.data[j].srcOne}" alt="">
                                           </div>
                                           <div class='comment-bd' data-sonId=${data.data.data[j].userOneId}  data-son=${data.data.data[j].commentSonId}>
                                               <div class='comment-bd-top'>
                                                   <span class='replyer'>${data.data.data[j].nicknameOne} &nbsp;&nbsp;回复了  &nbsp;&nbsp;${data.data.data[j].nicknameTwo}:</span>
                                                   <span class='reply-content'>
                                                       ${data.data.data[j].content}
                                                   </span>
                                               </div>
                                               <div class='comment-bd-bottom'>
                                                   <span class='span-time'>${data.data.data[j].releaseTime}</span>
                                                   <span class='span-collect1'><i class='iconfont icon-dianzanb'></i></span>
                                                   <span class="span-comments"><i class='iconfont icon-pinglun'></i></span>
                                                   <span class='span-report' onclick=information(this)><i class='iconfont icon-icon_jubao-xian'>举报</i></span>
                                                   ${data.data.data[j].userOneId==useId?"<span class='span-delete' onclick=remove1(this)><i class='iconfont icon-shanchu'></i></span>":''}
                                               </div>
                                               <!-- 点击回复会出现一个输入框 -->
                                               <div class='children1'>
                                                   <div class='pop-relay1'>
                                                       <textarea name="content" autocomplete="off" style="height: 60pa;padding: 10px;" class='text3'></textarea>
                                                   </div>
                                                   <div class='commentSub1'>
                                                       <button class='writeBack1' onclick=exhibition(this)>回复</button>
                                                   </div>
                                               </div>
                                           </div>
                                       </div>
                                    `
                                    getType('.answer')[i].innerHTML=str2;
                                    sonId.push(data.data.data[j].commentSonId)
                                    sonOneId2.push(data.data.data[j].userOneId)
                                    sonTwoId2.push(data.data.data[j].userTwoId) 
                                    // 判断子评论是否点过赞
                                    if(userIdmessage.innerHTML==''){
                                        for(let i=0;i<getType('.span-collect1').length;i++){
                                            getType('.span-collect1')[i].onclick=function(){
                                                getType('#loginmodal').style.display='block';
                                            }
                                        }
                                    }else{
                                        axios({
                                            url: '/video/JudgeThumbsUpComment',
                                            method: 'post',
                                            params:{
                                                userId:useId,
                                                commentType:1,
                                                commentId:sonId[j]
                                            }
                                        })
                                        .then(function(data){ 
                                            for(let i=0;i<getType('.span-collect1').length;i++){
                                                if(data.data.data.object1==1){
                                                    getType('.span-collect1')[i].style.color='red'  
                                                    getType('.span-collect1')[i].innerHTML=`<i class='iconfont icon-dianzanb'></i>${data.data.data.object}`          
                                                }else if(data.data.data.object1==0){
                                                    getType('.span-collect1')[i].style.color='grey' 
                                                        
                                                    getType('.span-collect1')[i].innerHTML=`<i class='iconfont icon-dianzanb'></i>`
                                                }                                     
                                                getType('.span-collect1')[i].onclick=function(){
                                                        axios({
                                                            url: '/video/ThumbsUpComment',
                                                            method: 'post',
                                                            params:{
                                                                userId:useId,
                                                                commentType:1,
                                                                commentId:sonId[i]
                                                            }
                                                        })
                                                        .then(function(data){
                                                            if(data.data.data.object1==1){
                                                                getType('.span-collect1')[i].style.color='red';
                                                                getType('.span-collect1')[i].innerHTML=`<i class='iconfont icon-dianzanb'></i>${data.data.data.object}`                                                          
                                                            }
                                                            else if(data.data.data.object1==0){
                                                                getType('.span-collect1')[i].style.color='grey';
                                                                getType('.span-collect1')[i].innerHTML=`<i class='iconfont icon-dianzanb'></i>${data.data.data.object}`                                                          
                                                            }
                                                        })
                                                        .catch(function(error){
                                                            console.log('错误')
                                                        })      
                                                } 
                                            }
                                        })
                                        .catch(function(error){
                                            console.log('错误')
                                        }) 
                                    }  
                                    // 对子评论进行评论
                                    var sonComment=getType('.span-comments').length
                                    if(userIdmessage.innerHTML==''){
                                        for(let i=0;i<sonComment;i++){
                                            getType('.span-comments')[i].onclick=function(){
                                                getType('#loginmodal').style.display='block';
                                            }
                                        }
                                    }else{
                                        for(let i=0;i<sonComment;i++){
                                            getType('.span-comments')[i].onclick=function(){
                                                getType('.children1')[i].style.display='block'
                                            }
                                        }
                                    }   
                               }
                           }
                       })
                       .catch(function (error) {
                           console.log(error)
                       })
                   }
                }
                showSonComment(); 
        }
    })
    .catch(function(error){
        console.log('遍历评论失败')
    })
}
showComment();

// 点击子评论会把评论遍历到该评轮的id上
function exhibition(th){     
    var replayId=th.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.getAttribute('data-fatherId');
    var TwoId=th.parentNode.parentNode.parentNode.getAttribute('data-sonId')
    var price=th.parentNode.parentNode.children[0].children[0].value  
    if(price==''){ 
        getType('.import-input')[0].style.display='block';
        getType('.import')[0].style.opacity='1'
        setTimeout(function(){
            getType('.import-input')[0].style.display='none';
            getType('.import')[0].style.opacity='0'
        },3000)
    }
    else{  
        axios({
            url: '/video/addCommentSon',
            method: 'post',
            params:{
                content:price,
                userOneId:useId,
                userTwoId:TwoId,
                commentId:replayId
            }
        })
        .then(function(data){
            showComment();  
        })
        .catch(function(error){
            console.log('错误')
        })
        
    }  
}
// 我要开始举报了
getType('.closew1')[0].onclick=function(){
    getType('.shade1')[0].style.display='none';
    getType('.CPM1')[0].style.opacity='0';
}
var obj=document.getElementsByName('radioName')
// if(obj[7].checked){
//     var judge=false;
// }
if(useId==''){
    function informer(){
        getType('#loginmodal').style.display='block';
    }
}else{
    // 主评论下的举报
    function informer(ha){
        var remarkId=ha.parentNode.parentNode.getAttribute('data-fatherId');
        getType('.shade1')[0].style.display='block';
        getType('.CPM1')[0].style.opacity='1';
        getType('.btn-sure1')[0].onclick=function(){
            if($('input[name="radioName"]:checked').val()==undefined){
                getType('.import-input2')[0].style.display='block';
                getType('.import2')[0].style.opacity='1';
                setTimeout(function(){
                    getType('.import-input2')[0].style.display='none';
                    getType('.import2')[0].style.opacity='0'
                },3000)
            }else{   
                    if(obj[7].checked){
                        getType('.other-reason')[0].style.display='block';
                        if(getType('.other-ta')[0].value==''){
                            getType('.import-input3')[0].style.display='block';
                            getType('.import3')[0].style.opacity='1';
                            setTimeout(function(){
                                getType('.import-input3')[0].style.display='none';
                                getType('.import3')[0].style.opacity='0'
                            },3000)
                        }else{
                            getType('.other-reason')[0].style.display='none';
                            axios({
                                url: "/addReportCommentRecord",
                                method: "post",
                                params:{
                                    commentId:remarkId,
                                    commentType:0,
                                    content:getType('.other-ta')[0].value,
                                    userId:useId
                                }
                            })
                            .then(function (data) {
                                getType('.import-input4')[0].style.display='block';
                                getType('.import4')[0].style.opacity='1';
                                setTimeout(function(){
                                    getType('.import-input4')[0].style.display='none';
                                    getType('.import4')[0].style.opacity='0'
                                },3000)
                                setTimeout(function(){
                                    getType('.shade1')[0].style.display='none';
                                    getType('.CPM1')[0].style.opacity='0'; 
                                },4000)                  
                            })
                            .catch(function (error) {
                                console.log(error)
                            })
                        }
                    }
                    for(var i=0;i<7;i++){
                        if(obj[i].checked){
                            var matter=obj[i].parentNode.children[1].innerHTML
                            axios({
                                url: "/addReportCommentRecord",
                                method: "post",
                                params:{
                                    commentId:remarkId,
                                    commentType:0,
                                    content:matter,
                                    userId:useId
                                }
                            })
                            .then(function (data) {
                                getType('.import-input4')[0].style.display='block';
                                getType('.import4')[0].style.opacity='1';
                                setTimeout(function(){
                                    getType('.import-input4')[0].style.display='none';
                                    getType('.import4')[0].style.opacity='0'
                                },3000)
                                setTimeout(function(){
                                    getType('.shade1')[0].style.display='none';
                                    getType('.CPM1')[0].style.opacity='0'; 
                                },4000)                  
                            })
                            .catch(function (error) {
                                console.log(error)
                            })
                        }
                    }
            }
        
        }
    }
}

// 子评论下的举报
if(useId==''){
    function information(){
        getType('#loginmodal').style.display='block';
    }
}else{
    // 主评论下的举报
    function information(hi){
        var remark=hi.parentNode.parentNode.getAttribute('data-son');
        getType('.shade1')[0].style.display='block';
        getType('.CPM1')[0].style.opacity='1';
        getType('.btn-sure1')[0].onclick=function(){
            if($('input[name="radioName"]:checked').val()==undefined){
                getType('.import-input2')[0].style.display='block';
                getType('.import2')[0].style.opacity='1';
                setTimeout(function(){
                    getType('.import-input2')[0].style.display='none';
                    getType('.import2')[0].style.opacity='0'
                },3000)
            }else{
                if(obj[7].checked){
                    getType('.other-reason')[0].style.display='block';
                    if(getType('.other-ta')[0].value==''){
                        getType('.import-input3')[0].style.display='block';
                        getType('.import3')[0].style.opacity='1';
                        setTimeout(function(){
                            getType('.import-input3')[0].style.display='none';
                            getType('.import3')[0].style.opacity='0'
                        },3000)
                    }else{
                        axios({
                            url: "/addReportCommentRecord",
                            method: "post",
                            params:{
                                commentId:remark,
                                commentType:1,
                                content:getType('.other-ta')[0].value,
                                userId:useId   
                            }
                        })
                        .then(function (data) {
                            getType('.import-input4')[0].style.display='block';
                            getType('.import4')[0].style.opacity='1';
                            setTimeout(function(){
                                getType('.import-input4')[0].style.display='none';
                                getType('.import4')[0].style.opacity='0'
                            },3000)
                            setTimeout(function(){
                                getType('.shade1')[0].style.display='none';
                                getType('.CPM1')[0].style.opacity='0'; 
                            },4000)                  
                        })
                        .catch(function (error) {
                            console.log(error)
                        })
                    }
                }
                for(var i=0;i<7;i++){
                    if(obj[i].checked){
                        var matter=obj[i].parentNode.children[1].innerHTML
                        axios({
                            url: "/addReportCommentRecord",
                            method: "post",
                            params:{
                                commentId:remark,
                                commentType:1,
                                content:matter,
                                userId:useId
                                // useId
                            }
                        })
                        .then(function (data) {
                            getType('.import-input4')[0].style.display='block';
                            getType('.import4')[0].style.opacity='1';
                            setTimeout(function(){
                                getType('.import-input4')[0].style.display='none';
                                getType('.import4')[0].style.opacity='0'
                            },3000)
                            setTimeout(function(){
                                getType('.shade1')[0].style.display='none';
                                getType('.CPM1')[0].style.opacity='0'; 
                            },4000)                  
                        })
                        .catch(function (error) {
                            console.log(error)
                        })
                    }
                }
            }
        
        }
    }
}

// // 点击删除会出现删除的按钮
getType('.closew2')[0].onclick=function(){
    getType('.shade2')[0].style.display='none';
    getType('.CPM2')[0].style.opacity='0';
}
// 删除主评论
function remove(le){
    var deleteMainId=le.parentNode.parentNode.getAttribute('data-fatherId');
    getType('.shade2')[0].style.display='block';
    getType('.CPM2')[0].style.opacity='1';
    getType('.btn-del')[0].onclick=function(){
        getType('.shade2')[0].style.display='none';
        getType('.CPM2')[0].style.opacity='0';
    }
    getType('.btn-sure2')[0].onclick=function(){
        axios({
            url: "/deleteComment",
            method: "delete",
            params:{
                commentId:deleteMainId,
                userId:useId
            }
        })
        .then(function (data) {
            getType('.import-input5')[0].style.display='block';
            getType('.import5')[0].style.opacity='1';
            setTimeout(function(){
                getType('.shade2')[0].style.display='none';
                getType('.CPM2')[0].style.opacity='0'; 
            },100)  
            setTimeout(function(){
                getType('.import-input5')[0].style.display='none';
                getType('.import5')[0].style.opacity='0'
            },3000)
            showComment();             
        })
        .catch(function (error) {
            console.log(error)
        })
    }
}
// 删除子评论
function remove1(te){
    var deleteSonId=te.parentNode.parentNode.getAttribute('data-son');;
    getType('.shade2')[0].style.display='block';
    getType('.CPM2')[0].style.opacity='1';
    getType('.btn-del')[0].onclick=function(){
        getType('.shade2')[0].style.display='none';
        getType('.CPM2')[0].style.opacity='0';
    }
    getType('.btn-sure2')[0].onclick=function(){
        axios({
            url: "/deleteCommentSonByUserOne",
            method: "delete",
            params:{
                commentSonId :deleteSonId,
                userOneId :useId
            }
        })
        .then(function (data) {
            getType('.import-input5')[0].style.display='block';
            getType('.import5')[0].style.opacity='1';
            setTimeout(function(){
                getType('.shade2')[0].style.display='none';
                getType('.CPM2')[0].style.opacity='0'; 
            },100)  
            setTimeout(function(){
                getType('.import-input5')[0].style.display='none';
                getType('.import5')[0].style.opacity='0'
            },3000)
            showComment();   
        })
        .catch(function (error) {
            console.log(error)
        })
    }
}
function text(){
    getType('.other-reason')[0].style.display='block';
}
function text1(){
    getType('.other-reason')[0].style.display='none';
}
function text2(){
    getType('.other-reason')[0].style.display='none';
}
function text3(){
    getType('.other-reason')[0].style.display='none';
}
function text4(){
    getType('.other-reason')[0].style.display='none';
}
function text5(){
    getType('.other-reason')[0].style.display='none';
}
function text6(){
    getType('.other-reason')[0].style.display='none';
}
function text7(){
    getType('.other-reason')[0].style.display='none';
}
